<template>
	<view class="">
		<view class="username">
			<view class="itemTitle">
				收货人：
			</view>
			<input type="text" v-model="username" placeholder="收货人姓名" />
		</view>
		<view class="addressItem">
			<view class="itemTitle">
性别
			</view>
			<text :class="{sexActive:sex==0}" @click="sexChange(0)">先生</text>
			<text :class="{sexActive:sex==1}" @click="sexChange(1)">女士</text>
		</view>
		<view class="addressItem">
			<view class="itemTitle">
				电话号码：
			</view>
			<input type="text" v-model="telphone" placeholder="收货人的联系电话" />
		</view>
		<view class="addressItem">
			<view class="itemTitle">
				收货地址：
			</view>
			<pickerAddress class="city" @change="change">{{city}}</pickerAddress>
		</view>
		<view class="addressBox">
			<view class="itemTitle">
				详细地址：
			</view>
			<textarea v-model="address" placeholder="请输入详细地址" />
		</view>
		<view class="addressBox">
			<view class="itemTitle">
				备注：
			</view>
			<textarea v-model="remarks" placeholder="请输入备注信息" />
		</view>
		<!-- <view class="defaultItem">
			<view class="itemTitle">
				默认地址：
			</view>
			<switch @change="defaultChange" checked="true" color="#0bbbef" style="transform:scale(0.8)"/>
		</view> -->

<uniModel :textmsg="textmsg" @operation="operation" v-show="showTextmsg"></uniModel>
		<view class="saveAddress" @click="addAddress">
			保存
		</view>


	</view>
</template>

<script>
	import pickerAddress from '../../compnents/wangding-pickerAddress/wangding-pickerAddress.vue'
	import uniModel from '../../compnents/unimodel.vue'
	import {
		addUserApi
	} from "../../api/add_user.js"
	export default {
		data() {
			return {
				city: '请选择收货地址',
				username: "",
				telphone: '',
				address: '',
				// default:1,
				sex: 0,
				remarks: '',
				memberId:'',
				open_id:'',
				nickName:'',
				headimage:'',
				showTextmsg:false,
				textmsg: {
					title: '',
					content: '',
					confirm: '好的'
				}
			}
		},
		components: {
			pickerAddress,
			uniModel
		},
		onLoad() {
			this.memberId=uni.getStorageSync('member_id');
			this.open_id=uni.getStorageSync('openId');
			this.nickName=uni.getStorageSync('nickName');
			this.headimage=uni.getStorageSync('avatarUrl');
		},
		methods: {
			//确认框
			operation(e) {
				let that = this;
					that.showTextmsg = false;	
				uni.navigateTo({
					url:'/pages/main/pointWheel'
				})
			},
			sexChange(index) {
				this.sex = index
			},
			defaultChange(e) {
				if (e.target.value == true) {
					this.default = 1
				} else {
					this.default = 0
				}
			},
			change(data) {
				this.city = data.data.join('')
				console.log(data.data.join(''))
			},
			async addAddress() {
				//验证表单
				if (this.username == '' || this.username == null || this.username == undefined) {
					uni.showToast({
						title: '请填写用户名',
						icon: 'error',
						duration: 1500
					});
					return;
				}
				if (this.telphone == '' || this.telphone == null || this.telphone == undefined) {
					uni.showToast({
						title: '未填写电话号码',
						icon: 'error',
						duration: 1500
					});
					return;
				}
				if (this.city == '' || this.city == null || this.city == undefined) {
					uni.showToast({
						title: '请填写所在城市',
						icon: 'error',
						duration: 1500
					});
					return;
				}
				if (this.address == '' || this.address == null || this.address == undefined) {
					uni.showToast({
						title: '请填写详细地址',
						icon: 'error',
						duration: 1500
					});
					return;
				}
				if (this.nickName == '' || this.nickName == null || this.nickName == undefined) {
					uni.showToast({
						title: '昵称为空',
						icon: 'error',
						duration: 1500
					});
					return;
				}
				if (this.headimage == '' || this.headimage == null || this.headimage == undefined) {
					uni.showToast({
						title: '头像为空',
						icon: 'error',
						duration: 1500
					});
					return;
				}
				if (this.memberId == '' || this.memberId == null || this.memberId == undefined) {
					uni.showToast({
						title: '会员信息为空',
						icon: 'error',
						duration: 1500
					});
					return;
				}
				let params = {
					address: this.address,
					nickName:this.nickName,
					city: this.city,
					memberId: this.memberId,
					name: this.username,
					openId: this.open_id,
					phone:this.telphone,
					remark:this.remarks,
					sex:this.sex,
					headimage:this.headimage
					
				}
				const res = await addUserApi(params)
				// console.log(8888,res)
				if (res.statusCode === 200) {
					if(res.data.code=='0'){
						this.showTextmsg=true
						this.textmsg.title="注册成功"
					}else{
						this.showTextmsg=true
						this.textmsg.title=res.data.message
					}

				}




			}
		}
	}
</script>

<style>
	.username {
		padding: 0 30rpx;
		display: flex;
		height: 90rpx;
		align-items: center;
	}

	.itemTitle {
		width: 140rpx;
		font-size: 28rpx;
	}

	.username input {
		border-bottom: 1rpx solid #e5e5e5;
		flex: 1;
		line-height: 90rpx;
		height: 90rpx;
	}

	.addressItem {
		display: flex;
		margin: 0 30rpx;
		height: 90rpx;
		align-items: center;
		border-bottom: 1rpx solid #e5e5e5;
	}

	.addressItem text {
		width: 80rpx;
		height: 45rpx;
		display: block;
		border: 1rpx solid #e5e5e5;
		font-size: 24rpx;
		margin-right: 10rpx;
		text-align: center;
		line-height: 45rpx;
		color: #999;
	}

	.addressItem text.sexActive {
		background: #0bbbef;
		color: #fff;
		border: none
	}

	.addressBox {
		height: 180rpx;
		display: flex;
		margin: 0 30rpx;
		border-bottom: 1rpx solid #e5e5e5;
	}

	.addressBox .itemTitle {
		width: 140rpx;
		line-height: 90rpx;
	}

	.addressBox textarea {
		flex: 1;
		height: 180rpx;
		padding-top: 25rpx;
	}

	.saveAddress {
		width: 600rpx;
		height: 80rpx;
		margin: 80rpx auto;
		background: #0bbbef;
		color: #fff;
		font-size: 28rpx;
		text-align: center;
		line-height: 80rpx;
		border-radius: 80rpx;
	}

	.city {
		font-size: 28rpx;
		color: #000;
	}

	.defaultItem {
		margin: 0 30rpx;
		display: flex;
		height: 90rpx;
		align-items: center;
		justify-content: space-between;
	}
</style>
